﻿@section header {
<link rel="stylesheet" type="text/css" href="http://localhost/ext-4.0-beta2/examples/shared/example.css" /> 
<script src="http://localhost/ext-4.0-beta2/examples/shared/examples.js" type="text/javascript"></script>
    <script type="text/javascript">
        /**
        * chw 2011.4.7
        * panel: 主面板
        */
        Ext.onReady(function () {
            Ext.example.msg('新提醒', '您接收到来自***的提醒</br>标题是:****');
            var winMR;
            var panel = Ext.create('Ext.panel.Panel', {
                region: 'center',
                layout: {
                    type: 'hbox',
                    align: 'stretch'
                    //pack: 'start'
                },
                defaults: {
                    flex: 1 //子元素平均分配宽度
                },
                split: true,
                autoScroll: true,
                bodyPadding: 0,
                border: 0,
                padding: 0,
                margin: 0,
                tbar: [
                    { xtype: 'label', text: '个人办公 -> 我的提醒', cls: 'formNav' },
                    { xtype: 'tbfill' },
                    { xtype: 'button', iconCls: 'helpIcon', tooltip: '帮助', tooltipType: 'title', handle: function (source, e) { alert('帮助!') } }
                ]/*,
                bbar: [
                          { xtype: 'button', text: 'Button 1', handler: function (source, e) { openWindow(); } }
                        ],
                html: ''*/
            });
            new Ext.container.Viewport({
                layout: 'border',
                border: 0,
                items: [
                panel
                ]
            });

            Ext.regModel('role', {
                //            fields: ['ID','privilegeName', 'resourceCode', 'privilegeCode']
                fields: [
            { name: 'createDT', type: 'date' },
            { name: 'subject', type: 'string' },
            { name: 'content', type: 'string' },
            { name: 'creator', type: 'string' },
            { name: 'alarmBegin', type: 'date' },
            { name: 'count', type: 'int' },
            { name: 'span', type: 'int' }
            ]
            });

            var roleGrid = new Ext.grid.GridPanel({
                store: new Ext.data.ArrayStore({
                    model: 'role',
                    //sorters: ['orderNO'],
                    data: [
                    ['2011/1/1', '新年工作计划', '完成新年工作计划,并发送给局长', '李林', '2011/1/10 8:00',2,5],
                    ['2011/1/1', '新年工作计划', '完成新年工作计划,并发送给局长', '李林', '2011/1/10 8:00', 2, 5],
                    ['2011/1/1', '新年工作计划', '完成新年工作计划,并发送给局长', '李林', '2011/1/10 8:00', 2, 5],
                    ['2011/1/1', '新年工作计划', '完成新年工作计划,并发送给局长', '李林', '2011/1/10 8:00', 2, 5],
                    ['2011/1/1', '新年工作计划', '完成新年工作计划,并发送给局长', '李林', '2011/1/10 8:00', 2, 5],
                    ['2011/1/1', '新年工作计划', '完成新年工作计划,并发送给局长', '李林', '2011/1/10 8:00', 2, 5],
                    ['2011/1/1', '新年工作计划', '完成新年工作计划,并发送给局长', '李林', '2011/1/10 8:00', 2, 5],
                    ['2011/1/1', '新年工作计划', '完成新年工作计划,并发送给局长', '李林', '2011/1/10 8:00', 2, 5],
                    ['2011/1/1', '新年工作计划', '完成新年工作计划,并发送给局长', '李林', '2011/1/10 8:00', 2, 5]
                ]
                }),
                margin: 6,
                //width: 400,
                //height: 300,
                autoScroll: true,
                border: 0,
                padding: 0,
                bodyPadding: 0,
                flex: 3,
                //stripeRows: true,
                plugins: [new Ext.grid.CellEditing({ clicksToEdit: 2 })],
                selModel: { selType: 'cellmodel' },
                tbar: [
                          { xtype: 'button', iconCls: 'iconNew', text: '', tooltip: '新建角色', tooltipType: 'title', handler: function (source, e) { winMR.show(this); } },
                          { xtype: 'button', iconCls: 'iconEdit', text: '', tooltip: '编辑角色', tooltipType: 'title', handler: function (source, e) { Ext.getCmp('grid001').view.refresh(); } },
                          { xtype: 'button', iconCls: 'iconDelete', text: '', tooltip: '删除角色', tooltipType: 'title', handler: function (source, e) { Ext.getCmp('grid001').view.refresh(); } },
                          { xtype: 'tbseparator' },
                          { xtype: 'tbfill' },
                          { xtype: 'button', iconCls: 'iconRefresh', text: '', tooltip: '刷新', tooltipType: 'title', handle: function (source, e) { alert('刷新当前页签!') } }
                        ],
                title: '我的提醒列表',
                frame: true,
                columns: [
                new Ext.grid.RowNumberer(),
                {
                    text: 'ID',
                    dataIndex: 'ID',
                    width: 100,
                    hidden: true
                }, {
                    text: '创建时间',
                    dataIndex: 'createDT',
                    width: 100,
                    field: { allowBlank: false }
                }, {
                    text: '标题',
                    dataIndex: 'subject',
                    width: 160,
                    field: { allowBlank: false },
                    renderer: function (v) { return '<a href="#">' + v + '</a>'; }
                }, {
                    text: '内容',
                    dataIndex: 'content',
                    flex: 1,
                    field: { allowBlank: false }
                }, {
                    text: '创建人',
                    dataIndex: 'creator',
                    //renderer: function (v) { return '<a href="#">' + v + '</a>'; },
                    width: 100,
                    //field: { allowBlank: false },
                }, {
                    text: '提醒时间',
                    dataIndex: 'alarmBegin',
                    //renderer: function (v) { return '<a href="#">' + v + '</a>'; },
                    width: 100,
                    //field: { allowBlank: false },
                }, {
                    text: '提醒次数',
                    dataIndex: 'count',
                    //renderer: function (v) { return '<a href="#">' + v + '</a>'; },
                    width: 100,
                    //field: { allowBlank: false },
                }, {
                    text: '间隔',
                    dataIndex: 'span',
                    //renderer: function (v) { return '<a href="#">' + v + '</a>'; },
                    width: 100,
                    //field: { allowBlank: false },
                }, {
                    text: '操作',
                    //dataIndex: 'Summary',
                    width: 50,
                    align: 'center',
                    renderer: function (v) { return '<span class="iconEdit" style="width:20px;height:18px;" title="修改"></span><span class="iconDelete" style="width:20px;height:18px;" title="修改"></span>'; }
                }],
                viewConfig: {
                    listeners: {
                        //                    itemdblclick: function (view, record, el, index, e) { /*alert(record.get("ID"))*/winMR.show(this) },
                        itemclick: function (view, record, el, index, e) {

                        }
                    }
                }
            }); // grid

        panel.add(roleGrid);

        winMR = Ext.create('Ext.window.Window', {
            title: '新建提醒',
            modal: true,
            autoHeight: true,
            closable: true,
            closeAction: 'hide',
            //animateTarget: this,
            width: 800,
            //height: 500,
            layout: 'fit',
            bodyStyle: 'padding: 5px;',
            items: [
            new Ext.form.FormPanel({
                
                autoScroll: true,
                bodyStyle: 'padding:5px 5px 0',
                fieldDefaults: {
                    labelAlign: 'top',
                    msgTarget: 'side',
                    width: '100%',
                    margin: "4 10",
                    anchor: '100%',
                    columnWidth: .5
                },
                layout: 'column',
                items: [
                    {
                        xtype: 'textfield',
                        name: '标题',
                        fieldLabel: '标题',
                        columnWidth:1,
                        allowBlank: false
                    }, {
                        xtype: 'htmleditor',
                        name: '内容',
                        columnWidth: 1,
                        fieldLabel: '内容',
                        allowBlank: false
                    }, {
                        xtype: 'fieldset',
                        title: '提醒方式',
                        collapsible: true,
                        columnWidth: 1,
                        layout: 'column',
                        margin: 10,
                        items: [{
                            xtype: 'datefield',
                            name: '提醒时间',
                            fieldLabel: '提醒时间',
                            columnWidth: .3,
                            allowBlank: false
                        },{
                            xtype: 'timefield',
                            name: '提醒时间',
                            fieldLabel: ' ',
                            columnWidth: .3,
                            allowBlank: false
                        }, {
                            xtype: 'numberfield',
                            name: '每隔(分)',
                            fieldLabel: '每隔(分)',
                            value:5,
                            columnWidth: .2,
                            allowBlank: false
                        }, {
                            xtype: 'numberfield',
                            name: '提醒次数',
                            value:3,
                            fieldLabel: '提醒次数',
                            columnWidth: .2,
                            allowBlank: false
                        }]
                    }
                ],
                buttons: [{
                    text: '保存',
                    handler: function () { alert('保存') }
                }, {
                    text: '取消',
                    handler: function () { alert('取消') }
                }]
            })
            ]
        });

    });      // Ext.onReady

            
    </script>
}
